<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <title>task13</title>
</head>

<body>
  <label>请输入北京今天空气质量:<input id="api-input" type="text"></label>
  <button id="button">确认填写</button>
  <div>您输入的值是:<span id="api-display">尚无录入</span></div>
  <script>
    /*
             在注释下方写下代码
             给按钮button绑定一个点击事件
             在事件处理函数中
             获取aqi-input输入的值，并显示在aqi-display中
             */
    (function() {
      var button = document.getElementById("button"),
          input = document.getElementById("api-input"),
          display = document.getElementById("api-display");
          button.addEventListener('click', function() {
            //获取input的去空格之后的值value
            var val = input.value.replace(/\s+/g, "");
            if (val) {
              display.innerText = val;
            } else {
              display.innerText = '尚无录入';
            }
          });
      // button.onclick = function() {
      //   var val = input.value.replace(/\s+/g, "");
      //   if (val) {
      //     display.innerText = val;
      //   } else {
      //     display.innerText = '尚无录入';
      //   }
      // }
    })();
  </script>
</body>

</html>